<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html lang="zh">
<head>
    <title>物资盘点记录</title>
    <jsp:include page="/WEB-INF/view/commons/css.jsp" />
</head>
<body >
<div id="main-container" class="container-fluid">
    <form  action="appCheckPlan/updateCheck" name="inputForm" id="inputForm" method="post" class="form-horizontal">
    <input name="id" id="id" value="${entity.id}" type="hidden" />
    <input name="checkCode" id="checkCode" value="${barCode}" type="hidden" />
    <input name="grantOrgName" id="grantOrgName" value="${deparment.name}" type="hidden" />
    <input name="checkStatus" id="checkStatus" value="${entity.checkStatus}" type="hidden" />
        <div class="mt20">
            <div class="row form-group">
                <div class="col-sm-12">
                    <input class="form-control inline" type="text" disabled="disabled" value="${entity.planName}" name="planName" placeholder="请填写主题">
                </div>
            </div>
            <div class="info-title">
                <h2>物资盘点计划表</h2>
                <img src="data:image/png;base64,${barCodeImg}">
            </div>
            <div class="row mt20">
                <div class="col-sm-8" style="padding-top: 7px">${barCode}</div>
                <div class="form-group col-sm-4" style="padding-right: 0">
                    <label class="control-label col-sm-4" id="matNums">共<span id="mats">${checkMats}</span>件物资</label>
                </div>
            </div>
            <table id="table_data" class="table table-striped table-bordered table-hover">
                <thead id="mainthead">
                <tr>
                    <th style="width: 30px;">序号</th>
                    <th style="width: 100px;">物资编号</th>
                    <th style="width: 150px;">物资名称</th>
                    <th style="width: 50px;">规格</th>
                    <th style="width: 50px;">单位</th>
                    <th style="width: 50px;">系统库存</th>
                    <th style="width: 150px;">盘点库存</th>
                    <th style="width: 150px;">备注</th>
                </tr>
                </thead>
                <tbody id="maintbody">
                <c:choose>
                    <c:when test="${appCheckDetailList!= null && fn:length(appCheckDetailList)>0}">
                        <c:forEach var="each" varStatus="vs" items="${appCheckDetailList}">
                            <tr>
                                <td class='center'>${vs.index+1}</td>
                                <td class='center'>
                                    <span id="materialsCode${vs.index}s">${each.materialsCode}</span>
                                    <input type="hidden" id="materialsCode${vs.index}" name="itemEntity[${vs.index}].materialsCode" value="${each.materialsCode}"/>
                                    <input type="hidden" id="id${vs.index}" name="itemEntity[${vs.index}].id" value="${each.id}"/>
                                </td>
                                <td class='center'>
                                    <span id="materialsName${vs.index}s">${each.materialsName}</span>
                                    <input type="hidden" id="materialsId${vs.index}" name="itemEntity[${vs.index}].materialsId" value="${each.materialsId}"/>
                                    <input type="hidden" id="materialsName${vs.index}" name="itemEntity[${vs.index}].materialsName" value="${each.materialsName}"/>
                                </td>
                                <td class='center'>
                                    <span id="specification${vs.index}s">${each.specification}</span>
                                    <input type="hidden"  id="specification${vs.index}" name="itemEntity[${vs.index}].specification" value="${each.specification}"/>
                                </td>
                                <td class='center'>
                                    <span id="unit${vs.index}s">${each.unit}</span>
                                    <input type="hidden"  id="unit${vs.index}" name="itemEntity[${vs.index}].unit" value="${each.unit}"/>
                                </td>
                                <td class='center'>
                                    <span id="systemStock${vs.index}s">${each.systemStock}</span>
                                    <input type="hidden"  id="systemStock${vs.index}" name="itemEntity[${vs.index}].systemStock" value="${each.systemStock}"/>
                                </td>
                                <td class='center'>
                                    <input type="text" id="checkStock${vs.index}" name="itemEntity[${vs.index}].checkStock" value="${each.checkStock}" placeholder="盘点库存" required/>
                                </td>
                                <td class='center edit'>
                                    <input type="text" id="remark${vs.index}" name="itemEntity[${vs.index}].remark" value="${each.remark}" placeholder="备注" data-rule-maxlength="50"/>
                                </td>
                            </tr>
                        </c:forEach>
                    </c:when>
                    <c:otherwise>
                            <c:forEach var="each" begin="0" end="0" varStatus="vs">
                            <tr id="trs${vs.index}">
                                <td class='center'>${vs.index+1}</td>
                                <td class='center' >
                                    <span id="materialsCode${vs.index}s"></span>
                                    <input type="hidden" name="itemEntity[${vs.index}].materialsCode" value=""/>
                                </td>
                                <td class='center' onclick="showDialog();" >
                                    <span id="materialsName${vs.index}s"></span>
                                    <input type="hidden" name="itemEntity[${vs.index}].materialsId" value=""/>
                                    <input type="hidden" name="itemEntity[${vs.index}].materialsName" value=""/>
                                </td>
                                <td class='center'>
                                    <span id="specification${vs.index}s"></span>
                                    <input type="hidden" name="itemEntity[${vs.index}].specification" value=""/>
                                </td>
                                <td class='center'>
                                    <span id="unit${vs.index}s"></span>
                                    <input type="hidden" name="itemEntity[${vs.index}].unit" value=""/>
                                </td>
                                <td class='center'>
                                    <span id="systemStock${vs.index}s"></span>
                                    <input type="number" name="itemEntity[${vs.index}].systemStock" value="" placeholder="系统库存"/>
                                </td>
                                <td class='center'>
                                    <input type="text" name="itemEntity[${vs.index}].checkStock" value="" placeholder="盘点库存"/>
                                </td>
                                <td class='center edit'>
                                    <i class="fa fa-times-circle"></i>
                                </td>
                            </tr>
                            </c:forEach>
                    </c:otherwise>
                </c:choose>
                </tbody>
            </table>
            <div class="row">
                <div class="col-sm-8 form-group">
                    <div class="col-sm-2" style="width: 10%">备注：</div>
                    <div class="col-sm-8">
                        <input type="text" class="form-control" name="remark" value="${entity.remark}">
                    </div>
                </div>
                <div class="col-sm-4 form-group">
                    <div class="control-label col-sm-4">经办人：</div>
                    <div class="col-sm-8">
                        <input type="text" name="checker" class="form-control" value="${entity.checker}">
                    </div>
                </div>

            </div>
        </div>
    <div class="form-group">
        <div class="col-sm-offset-4 col-sm-4">
            <button id="save&print" type="button" class="btn btn-sm btn-primary" onclick="saveAndPrint()";><i class="fa fa-floppy-o"></i> 保存并打印</button>
            <button type="button" class="btn btn-sm btn-primary" onclick="savenAndSign();"><i class="fa fa-floppy-o"></i> 保存并签署</button>
            <button id="saveBtn" type="button" class="btn btn-sm btn-primary" onclick="save();"><i class="fa fa-floppy-o"></i> 保存</button>
        </div>
    </div>
    </form>
</div><!--/#main-container-->

<!-- script start -->
<jsp:include page="/WEB-INF/view/commons/js.jsp" />
<script type="text/javascript">
    var inDetailArr = new Array();
    var returnArr = new Array();

    $(document).ready(function(e) {
        var options = {
            rules:{
                planName : { required : true, maxlength : 100, isText:true },
                orgName : { required : true, maxlength : 100 },
                orgId : { required : true, digits : true  },
                checker:{ required : true, maxlength : 50, isText:true }
            }
        };
        $("#inputForm").validate(options);
        $("#orgSelect").change(function(e){
            if ($(this).val() == "") {
                $(".fa-org").removeClass("fa-check");
            }else{
                $(".fa-org").addClass("fa-check");
        	var name = $(this).find("option:selected").text();
        	$("#orgName").val(name);
            }
        });
        $("input[name=agentName]").bind('input propertychange', function(){
            if ($(this).val() == "") {
                $(".fa-agentName").removeClass("fa-check");
            }else{
                $(".fa-agentName").addClass("fa-check");
            }
        });
    });

    //定义全局变量储存当前table中的数据
    var curDetails;
    //弹出物资页面
    function showDialog(){
        curDetails = [];
        var trList = $("#maintbody").children("tr");
        for (var i=0;i<trList.length;i++) {
            var tdArr = trList.eq(i).find("td");
            var materialsCode = tdArr.eq(1).find('input').eq(0).val(); //编号

            var materialsId = tdArr.eq(2).find('input').eq(0).val();//ID
            var materialsName = tdArr.eq(2).find('input').eq(1).val();//名称
            var specification = tdArr.eq(3).find('input').val();//规格
            var unit = tdArr.eq(4).find('input').val();//单位
            var systemStock = tdArr.eq(5).find('input').val();//系统库存
            var checkStock = tdArr.eq(6).find('input').val();//盘点库存
            curDetails.push({
                    "materialsCode":materialsCode,
					"id":materialsId,
					"materialsId": materialsId,
					"materialsName": materialsName,
					"specification": specification,
					"unit" : unit,
					"systemStock":systemStock,
					"checkStock":checkStock
					});
        }
        $.extend(true,inDetailArr, curDetails); //深度合并inDetailArr添加填写的出库数量和备注

        returnArr = [];//清空当前变量
        $.each(inDetailArr,function(i,n){ //返回移除后的最终数组
            $.each(curDetails,function(j,s){
                if(n.id == s.id){
                    returnArr.push(n);
                }
            })
        });

        var layerIndex = layer.open({
            title: "物资查看",
            type: 2,
            content: "/bizMaterialsManage/select/",
            area: [800+"px", 570+"px"],
            success:function(layero,index){
                var body = layer.getChildFrame('body',index);
                var iframeWin = window[layero.find('iframe')[0]['name']];
                $.each(returnArr,function(i,n){
                    if(!n.id){
                       var index = $.inArray(n,returnArr);
                        returnArr.splice(index,1);
                    }
                });
                iframeWin.inputDataHandle(returnArr,'0');
            },
            btn: ['确定'],
            yes: function(index, layero){
            	layer.close(index);
            }
        });
    }

    //渲染当前页的表格数据
    function changeSelectedData(msg){
        inDetailArr = msg;
        $("#mats").text(msg.length);
        var tbody = $("<tbody id='maintbody'></tbody>");
        $.each(msg, function (i,n){
            var tr = $("<tr></tr>");
            tr.appendTo(tbody);
            var td = $("<td class='center'>"+(i+1)+"</td>");
            td.appendTo(tr)
            var td = $("<td class='center' > <span id='materialsCode"+i+"s'>"+n.materialsCode+"</span><input type='hidden' name='itemEntity["+i+"].materialsCode' value='"+n.materialsCode+"'/></td>");
            td.appendTo(tr)
            var td = $("<td class='center' onclick='showDialog();'> <span id='materialsName"+i+"s'>"+n.materialsName+"</span><input type='hidden' name='itemEntity["+i+"].materialsId' value='"+n.id+"'/><input type='hidden' name='itemEntity["+i+"].materialsName'value='"+n.materialsName+"'/></td>");
            td.appendTo(tr)
            var td = $("<td class='center'><span id='specification"+i+"s'>"+n.specification+"</span> <input type='hidden' name='itemEntity["+i+"].specification' value='"+n.specification+"'/></td>");
            td.appendTo(tr)
            var td = $("<td class='center'><span id='unit"+i+"s'>"+n.unitStr+"</span><input type='hidden' name='itemEntity["+i+"].unit' value='"+n.unitStr+"'/> </td>");
            td.appendTo(tr)
            var td = $("<td class='center'><span id='systemStock"+i+"s'>"+n.stockNum+"</span> <input type='hidden' name='itemEntity["+i+"].systemStock' value='"+ (n.stockNum ? n.stockNum : '') +"'/></td>");
            td.appendTo(tr)
            var td = $("<td class='center'><input type='number' disabled='disabled' name='itemEntity["+i+"].checkNum' value='" + (n.checkNum ? n.checkNum : '') + "' placeholder='盘点库存' required/> </td>");
            td.appendTo(tr)
            var td = $("<td class='center'><a href='javacript:void(0);' onclick='handlerDelete(this, this.parentElement.parentElement.rowIndex);'><i class='fa fa-times-circle'></i></a></td>");
            td.appendTo(tr)
        });
        $("#maintbody").html("");
        if(msg.length == 0){
        	var i = 0;
			var tr = $("<tr></tr>");
			var td = $("<td class='center'>"+(i+1)+"</td>");
            td.appendTo(tr)
            var td = $("<td class='center' > <span id='materialsCode"+i+"s'></span><input type='hidden' name='itemEntity["+i+"].materialsCode' value=''/></td>");
            td.appendTo(tr)
            var td = $("<td class='center' onclick='showDialog();'> <span id='materialsName"+i+"s'></span><input type='hidden' name='itemEntity["+i+"].materialsId' value=''/><input type='hidden' name='itemEntity["+i+"].materialsName' value=''/></td>");
            td.appendTo(tr)
            var td = $("<td class='center'><span id='specification"+i+"s'></span><input type='hidden' name='itemEntity["+i+"].specification' value=''/></td>");
            td.appendTo(tr)
            var td = $("<td class='center'><span id='unit"+i+"s'></span><input type='hidden' name='itemEntity["+i+"].unit' value=''/> </td>");
            td.appendTo(tr)
            var td = $("<td class='center'><span id='systemStock"+i+"s'></span><input type='hidden' name='itemEntity["+i+"].systemStock' value='' placeholder='系统库存'/></td>");
            td.appendTo(tr)
            var td = $("<td class='center'><input type='number' name='itemEntity["+i+"].checkNum' value='' placeholder='盘点库存' required/> </td>");
            td.appendTo(tr)
            var td = $("<td class='center'><a href='javacript:void(0);'><i class='fa fa-times-circle'></i></a></td>");
            td.appendTo(tr)
            tr.appendTo(tbody);
    	}
        $("#mainthead").after(tbody);
    }

    // 删除行
    function handlerDelete(obj, rowIndex){
        $(obj).parent().parent().remove();
        $("#mats").text(rowIndex-1);
        //如果是第一行，则新增一行空
        if($("#table_data").find("tr").length == 1){
            changeSelectedData([]);
        }
    }

    //保存并打印
    function saveAndPrint(){
        var option = {
            type:'post',
            dataType:'json',
            success:function(data){
                if(data.success){
                    $('#searchBtn', parent.document).click();
                    layer.open({
                        title: "打印",
                        type: 2,
                        content: "appCheckPlan/checkPrint/"+data.data,
                        area: ["60%", "90%"],
                        success:function(layero,index){

                        },
                        cancel:function(){
                        	 closeParentIframe();
                         }
                    });
                }else{
                    layer.alert(data.msg);
                }
            }
        }
        handlerSubmit(option);
    }
    //保存并签署
    function savenAndSign(){
        var option = {
            type:'post',
            dataType:'json',
            success:function(data){
                if(data.success){
                    $('#searchBtn', parent.document).click();
                    layer.open({
                        title: "待签署",
                        type: 2,
                        content: "appCheckPlan/checkSign/"+data.data,
                        area: ['60%', '90%'],
                        success:function(layero,index){

                        },
                        cancel:function(){
                            closeParentIframe();
                        }
                    });
                }else{
                    layer.alert(data.msg);
                }
            }
        }
        handlerSubmit(option);
    }
    //保存
    function save(){
        var option = {
            type:"post",
            dataType:"json",
            success:function(data){
                if(data.success){
                    $("#searchBtn", parent.document).click();
                    layer.alert(data.msg,function(){
                        closeIframe();
                    });
                }else{
                    layer.alert(data.msg);
                }
            }
        }
        handlerSubmit(option);
    }

    function handlerSubmit(option){
        var trArr = $("#maintbody").children("tr");
        if($("#inputForm").valid()){
            $("#inputForm").ajaxSubmit(option);
        }
    }
</script>
<!-- script end -->
</body>
</html>
